<template>
	<div class="shezhi">
		<div class="graybg"></div>
		
		<div class="header header_bg">

			<div class="header_left">
					<i onclick="javascript:history.back(-1)" class="iconfont baiColor">&#xe612;</i>
				
			</div>
			<div class="header_center">
				<span class="baiColor">设置</span>
			</div>
		</div>
		<div class="center" v-show="isShowSafe" style="padding-top: 47px;">
			<!--<section>
				<p class="pull-left">
					<span>账号关联</span>
				</p>
				<p class="pull-right">
					<i class="iconfont">&#xe615;</i>
				</p>
			</section>-->
			<section @click="safe">
				<p class="pull-left">
					<span>账号安全</span>
				</p>
				<p class="pull-right">
					<i class="iconfont">&#xe615;</i>
				</p>
			</section>
			<!--<section @click="clear">
				<p class="pull-left">
					<span>清理缓存</span>
				</p>
				<p class="pull-right">
					<i class="iconfont">&#xe615;</i>
				</p>
			</section>-->
				<router-link  :to="{name:'yijian'}">
			<section>
				<p class="pull-left">
					<span>意见反馈</span>
				</p>
				<p class="pull-right">
					<i class="iconfont">&#xe615;</i>
				</p>
			</section>
			</router-link>
			<router-link  :to="{name:'guanyu'}">
			<section>
				<p class="pull-left">
					<span>关于我们</span>
				</p>
				<p class="pull-right">
					<i class="iconfont">&#xe615;</i>
				</p>
			</section>
			</router-link>
			<section @click="tui">
				<p class="pull-left">
					<span>退出当前账号</span>
				</p>
				<p class="pull-right">
					<i class="iconfont">&#xe615;</i>
				</p>
			</section>
		</div>

		<div class="center" v-show="!isShowSafe" style="padding-top: 47px;">
			<router-link to="/findPass" class="colo">
				<section class="">
					<p class="pull-left">
						<span>修改登录密码</span>
					</p>
					<p class="pull-right">
						<i class="iconfont">&#xe615;</i>
					</p>

				</section>
			</router-link>
		</div>

		<div class="clearShow" v-show="isShowClear">
			<div class="kuang">
				<div class="tip">
					<p class="p1">提示</p>
					<p class="p2">确定清楚缓存？</p>
				</div>
				<div class="index">
					<p @click="close">
						<b class="">取消</b>
					</p>
					<p @click="sure">
						<b class="active">确定</b>
					</p>
				</div>
			</div>
		</div>
		<div class="clearShow" v-show="isShowTui">
			<div class="kuang">
				<div class="tip">
					<p class="p1">提示</p>
					<p class="p2">确定退出当前账号？</p>
				</div>
				<div class="index _width">
					<p @click="closeT">
						<b>取消</b>
					</p>
					<p @click="tuichu">
						<b class="active">退出</b>
					</p>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				isActive: true,
				isShowSafe: true,
				isShowClear: false,
				isShowTui:false
			}
		},
		methods: {
			safe: function() {
				this.isShowSafe = !this.isShowSafe;
			},
			//显示隐藏清除弹出框
			clear: function() {
				this.isShowClear = true;
			},
			tui:function(){
				this.isShowTui = true;
			},
			//点击确定要发请求，确定清楚缓存
			sure: function() {},
			//点击退出账号发送请求
			tuichu:function(){
				localStorage.clear()
				this.$router.push("wlogin");
			},
			close: function() {
				this.isShowClear = false;
			},
			closeT: function() {
				this.isShowTui = false;
			}
		}
	}
</script>

<style scoped="scoped">
	@import "../css/public.css";
	@import url("../css/iSheZhi.css");
	
	
	.colo {
		color: #333333;
	}
	
	
</style>